const HtmlWebpackPlugin=require('html-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports={
    entry:'./src/index.ts',
    output:{
        path:__dirname+'/dist',
        filename:'assets/js/bundle.js'
    },
    module:{
        rules:[{
            test:/\.ts$/,
            use:'ts-loader',
            exclude:/node-modules/
        },{  
            test: /\.css$/i,  
            use: [MiniCssExtractPlugin.loader, 'css-loader'],
        },{
            test:/\.(sass|scss)$/,
            use:[
                MiniCssExtractPlugin.loader,
                'css-loader',
                'sass-loader'
            ],
            exclude:/node-modules/
        }]
    },
    resolve:{
        alias:{
            //在webpack中设置代码@符号表示src这一层目录
            '@':__dirname+'/src/'
        },
        extensions:['.ts','.js']
    },
    plugins:[
        //清除dist目录
        new CleanWebpackPlugin(),
        //生成html
        new HtmlWebpackPlugin({
            title:'createjs-mobile-quickstart',
            template:'template/index.html'
        }),
        //抽离css文件
        new MiniCssExtractPlugin({
            filename:'./assets/css/index.css'
        })
    ]
}